<template>
	<view :class="['seckill',device=='ios'?'iosPadding':'androidPadding']">
		<view :class="device=='ios'?'ios_pageTitle':'and_pageTitle'">
			<view class="statusBar"></view>
			<view :class="['pageTitle','dFlex','jStart_aCenter']">
				<view class="backIcon imgPublic" @tap.stop='back'>
					<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/backIcon2.png" mode='widthFix'></image>
				</view>
			</view>
		</view>
		<view class="advImg imgPublic">
			<u-swiper :list="banner" mode='rect' :autoplay='true' :circular='true' :height='imgHeight'></u-swiper>
		</view>
		<view class="teamInfo dFlex jStart_aCenter" v-if='leaderInfo.address_id'>
			<view class="teamImg imgPublic">
				<image v-if='leaderInfo.address_id>0 && leaderInfo.store_imgs' :src="leaderInfo.store_imgs" mode="widthFix"></image>
				<image v-else src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/empty.png" mode="widthFix"></image>
			</view>
			<view class="info">
				<view class='tz'>{{leaderInfo.nickname}} {{" "+(leaderInfo.mobile?leaderInfo.mobile:leaderInfo.phone)}}</view>
				<view class="zt dFlex jStart_aCenter">
					<view class="shop">自提点：{{leaderInfo.address_id>0 && leaderInfo.store_name?leaderInfo.store_name:'暂未填写'}}</view>
				</view>
				<view class="ztAdd dFlex jBetween_aCenter">
					<view class="add">提货地址：<text>{{leaderInfo.address_id>0 && leaderInfo.address_detail?leaderInfo.address_detail:leaderInfo.address}}</text></view>
					<view class="" @tap='selZiti'>切换</view>
				</view>
			</view>
		</view>
		<!-- <u-sticky :offset-top='pagePad' bg-color='#ffffff' z-index='100'>
			<view class="menus dFlex jAround_aCenter sticky">
				<view :class="['menuOne',status=='1'?'active':'']" @tap='changeMenu(1)'>
					<view class="tit">今日秒杀</view>
					<view class="desc">爆款秒杀中</view>
				</view>
				<view :class="['menuOne',status=='2'?'active':'']" @tap='changeMenu(2)'>
					<view class="tit">明日秒杀</view>
					<view class="desc">敬请期待</view>
				</view>
				<view :class="['menuOne',status=='3'?'active':'']" @tap='changeMenu(3)'>
					<view class="tit">后日秒杀</view>
					<view class="desc">品牌超级秒杀</view>
				</view>
			</view>
		</u-sticky> -->
		<view class="list" v-if="list.length">
			<!-- <view v-for="(item,index) in list" :key='index'> -->
				<view :class="['shopOne','dFlex','jStart_aStart',item2.hui?'hui':'']" v-for="(item2,index2) in list" :key='index2' @tap.stop='lookDetail(item2.goods_id)' >
					<view class="shopImg imgPublic">
						<image :src="item2.goods_main_img"></image>
						<view class="noHave imgPublic" v-if="item.is_xg=='1' && item2.user_residue_num == 0">
							<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/noHave.png" mode="widthFix"></image>
						</view>
					</view>
					<view class="shopInfo">
						<view class="shopName">{{item2.goods_title}}</view>
						<view class="bar dFlex jStart_aCenter">
							<view class="progress">
								<view class="current" :style="'width:'+item2.rate+'%'"></view>
							</view>
							<text v-if="item2.startFlag && status=='1'">刚刚开抢</text>
						</view>
						<view class="config">
							<view class="priceTag dFlex jStart_aCenter">
								<view class="miaosha">新人价</view>
								<view class="jiang">已降{{(item2.goods_price - item2.nu_price).toFixed(2)}}元</view>
								<view class="xgNum" v-if='item.is_xg=="1"'>限购{{item2.xg_num}}份</view>
							</view>
							<view class="tools dFlex jBetween_aEnd">
								<view class="showPrice">￥<text>{{item2.nu_price}}</text></view>
								<view class="count dFlex jEnd_aCenter" v-if="!item2.hui && is_newuser">
									<view class='smallBtn imgPublic' @tap.stop='changeCount(2,index2)'>
										<image src='https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/jian.png' mode='widthFix'></image>
									</view>
									<view class='smallIpt'>
										<input type="number" v-model='item2.num' disabled :max='item.is_xg=="1"?item2.user_residue_num:item2.nu_stock'>
									</view>
									<view class='smallBtn imgPublic' @tap.stop='changeCount(1,index2)'>
										<image src='https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/jia.png' mode='widthFix'></image>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			<!-- </view> -->
		</view>
		<view class="list empty imgPublic" v-else>
			<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/empty.png" mode="widthFix"></image>
		</view>
		<view class="seat"></view>
		<view :class="['bottomBtn',device == 'ios'?'ios_safe':'','dFlex','jBetween_aCenter']" v-if='status=="1"'>
			<view class="opBtns dFlex jStart_aCenter">
				<view class="smallMenu" @tap.stop='back'>
					<view class="menuIcon">
						<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/seckill_home.png" mode="widthFix"></image>
					</view>
					<text>首页</text>
				</view>
				<button open-type="share" class="smallMenu">
					<view class="menuIcon">
						<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/seckill_share.png" mode="widthFix"></image>
					</view>
					<text>分享</text>
				</button>
				<!-- <view class="smallMenu">
					<view class="menuIcon">
						<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/seckill_car.png" mode="widthFix"></image>
					</view>
					<text>购物车</text>
					<view class="count" v-if="carnum>0">{{carnum}}</view>
				</view> -->
			</view>
			<view v-if="is_newuser" class="tj dFlex jEnd_aCenter">
				<view class="resultPrice">共{{carnum}}件{{' '}}合计:<text>￥{{allPrice?parseFloat(allPrice.toFixed(2)):'0.00'}}</text></view>
				<view class="payBtn" @tap.stop='pay'>去支付</view>
			</view>
		</view>
		<view class="zz dFlex flexDirection jCenter_aCenter zz2" v-if='postFlag'>
			<canvas canvas-id="myCanvas" id="myCanvas" :style="'width:80%;height:'+canvasHeight+'px;'"></canvas>
			<view class="seat"></view>
			<view :class="['opBtns',device == 'ios'?'ios_sureBtn':'']">
				<view class='toast'>立即分享</view>
				<view class='btns dFlex jAround_aCenter'>
					<button open-type="share" class="opBtnOne">
						<view class="btnImg imgPublic">
							<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/weixin.png" mode="widthFix"></image>
						</view>
						<text>微信好友</text>
					</button>
					<view class="opBtnOne" @tap.stop='saveImg'>
						<view class="btnImg imgPublic">
							<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/shareIcon4.png" mode="widthFix"></image>
						</view>
						<text>保存图片</text>
					</view>
				</view>
				<view class='close' @tap.stop='postFlag = false'>关闭</view>
			</view>
		</view>
		
		<login :loginStatus='loginStatus' @opFlag='closeLogin' :code='code' :status='1'></login>
		<Address :store='storeOne' :count='count' @opFlag='closeAdd' @selLine='selLine' @changeAdd='selZiti'></Address>
	</view>
</template>

<script>
	import login from '@/components/login.vue';
	import address from '@/components/address.vue';
	export default {
		components: {
			login,
			address
		},
		data() {
			return {
				canvasHeight:"",
				postFlag:false,
				shareCode:'',
				postImg:'',
				adv:'',
				
				loginStatus:true,
				code:'',
				
				share:'',// 1 推品端跳转分享
				id:'',//新人礼id
				mobile:'',
				
				device:getApp().globalData.platform,
				status:'1',
				page:1,
				load:false,
				pagePad:0,
				leaderInfo:{},
				list:[],
				datas:{},
				
				carnum:0,
				allPrice:0,
				is_newuser:false,
				banner:[],
				imgHeight:'',
				link:'',
				
				// 最近的门店
				storeOne:{},
				count:0,//弹窗提示限制1次
			};
		},
		onLoad(e) {
			this.share = e.share?e.share:'';
			if(e.scene){
				// 识别 扫描二维码
				let canshu = decodeURIComponent(e.scene)?decodeURIComponent(e.scene):'';
				this.link = canshu;
				let csArr = canshu.split('&');
				this.id = csArr[0].split('=')[1];
				this.mobile = csArr[1].split('=')[1];
				uni.setStorageSync('tjr_mobile',this.mobile);
			}else{
				this.link = this.tool.objToUrl(e);
			}
			if(this.share == '1'){
				this.id = e.id;
				this.mobile = e.mobile;
				uni.setStorageSync('tjr_mobile',e.mobile);
			}else if(!this.share){
				this.id = e.id;
				if(e.mobile){
					this.mobile = e.mobile;
					uni.setStorageSync('tjr_mobile',e.mobile);
				}else{
					this.mobile = uni.getStorageSync('tjr_mobile');
				}
			}
			uni.getLocation({
				success: (locate) => {
					if(locate.errMsg == 'getLocation:ok'){
						getApp().globalData.lat = locate.latitude;
						getApp().globalData.lng = locate.longitude;
					}
				},
				fail:(err)=>{
					uni.showToast({
						title:'定位信息获取失败',
						icon:"none"
					})
				},
				complete: () => {
					if(this.share){
						this.initCode();
					}
					this.page = 1;
					this.carnum = 0;
					this.allPrice = '';
					this.initList();
					// this.initConfig();
					
					if(uni.getStorageSync('user_level') == '2'){//团长
						// 判断团长有没有设置地址
						this.getLeaderAdd();
					}else{//普通用户
						this.initLeaderInfo();
					}
				}
			})
		},
		onShow(){
			if(!uni.getStorageSync('uToken')){
				wx.login({
					success:(login)=>{
						this.code = login.code;
					},
					fail:(err)=>{
						console.log(err);
					}
				})
			}
			if(this.device == 'ios'){
				// this.pagePad = (uni.getSystemInfoSync().statusBarHeight + 60) * 2;
				this.pagePad = uni.getSystemInfoSync().statusBarHeight + 120;
			}else{
				this.pagePad = uni.getSystemInfoSync().statusBarHeight + 114;
			}
		},
		onReachBottom() {
			if(this.load){
				this.load = false;
				this.page ++ ;
				this.initList();
			}
		},
		onShareAppMessage() {
			this.tool.monitor(this.link);
			let share = {}
			if(!this.share){
				share.title = this.datas.title;
				share.path = '/seller/ceremony?id='+this.id+"&mobile="+this.mobile;
				// share.imageUrl = this.datas.share_img;
				share.imageUrl = 'https://zl-tuangou.oss-cn-qingdao.aliyuncs.com'+this.datas.cover_img;
				// share.desc = this.datas.notice;
				share.desc = '';
			}else{
				share.title = this.datas.share_words?this.datas.share_words:this.datas.title;
				share.path = '/seller/ceremony?id='+this.id+"&mobile="+this.mobile;
				share.imageUrl = this.shareCode?this.shareCode:this.adv;
				// share.desc = this.datas.notice;
				share.desc = '';
			}
			return share;
		},
		onShareTimeline() {
			this.tool.monitor(this.link);
			let share = {}
			if(!this.share){
				share.title = this.datas.title;
				share.path = '/seller/ceremony?id='+this.id+"&mobile="+this.mobile;
				// share.imageUrl = this.datas.share_img;
				share.imageUrl = 'https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/'+this.datas.cover_img;
				// share.desc = this.datas.notice;
				share.desc = '';
			}else{
				share.title = this.datas.share_words?this.datas.share_words:this.datas.title;
				share.path = '/seller/ceremony?id='+this.id+"&mobile="+this.mobile;
				share.imageUrl = this.shareCode?this.shareCode:this.adv;
				// share.desc = this.datas.notice;
				share.desc = '';
			}
			return share;
		},
		methods:{
			// 获取团长地址
			getLeaderAdd(){
				this.tool.getData('/api/user/info',{},'',this).then(res=>{
					if(res){
						if(res.address_id){//设置了地址
							this.leaderInfo = {
								address:res.address,
								address_detail:res.address_detail?res.address_detail:'',
								address_id:res.address_id,
								mobile:res.mobile?res.mobile:'',
								phone:res.phone?res.phone:'',
								nickname:res.nickname,
								id:res.id,
								store_imgs:res.store_imgs,
								store_name:res.store_name,
							}
						}else{//没设置地址 获取列表第一个
							this.initAddList();
						}
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			initAddList(){
				this.tool.getData('/api/mall/returnTeamList',{
					lat:getApp().globalData.lat,
					lng:getApp().globalData.lng,
					keyword:"",
				}).then(res=>{
					if(res && res.length){
						if(uni.getStorageSync('user_level') != '2'){
							this.storeOne = this.count == '0'?res[0]:{};
						}else{
							uni.showModal({
								content:'当前团长未设置自提点，是否现在设置',
								success: (op) => {
									if(op.confirm){
										uni.navigateTo({
											url:"/my/tmAddress"
										})
									}
								},
								fail:(err)=>{
									
								}
							})
						}
						this.leaderInfo = {
							address:res[0].address,
							address_detail:res[0].address_detail,
							address_id:res[0].id,
							mobile:res[0].mobile?res[0].mobile:'',
							phone:res[0].phone?res[0].phone:'',
							nickname:res[0].receiver,
							id:res[0].user_id,
							store_imgs:res[0].store_imgs,
							store_name:res[0].store_name,
						}
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 选择该地址
			selLine(data){
				this.leaderInfo = this.storeOne;
				this.count = 1;
			},
			// 关闭弹窗
			closeAdd(data){
				this.initAddList();
				this.count = data;
			},
			/* initConfig(){
				this.tool.getData('/api/mall/getPageSettingNew',{
					side:'c端',
					page:'首页'
				}).then(res=>{
					console.log(res);
					if(res){
						res.setting.map((item,index)=>{
							if(item.name == '新人购_轮播图'){
								item.content = item.content.split(',');
								item.content.map((item2,index2)=>{
									item2 = 'https://zl-tuangou.oss-cn-qingdao.aliyuncs.com'+item2;
									this.banner.push(item2);
								})
								uni.getImageInfo({
									src:this.banner[0],
									success: (info) => {
										let rate = info.width / info.height;
										this.imgHeight = (uni.getSystemInfoSync().windowWidth / rate) * 2 ;
									},
									fail:(err)=>{
										console.log(err);
									}
								})
							}
						})
					}
					this.initList();
				}).catch(err=>{
					console.log(err);
				})
			}, */
			initLeaderInfo(){
				this.tool.getData('/api/miaosha/getMiaoshaInfoToc',{
					lat:getApp().globalData.lat,
					lng:getApp().globalData.lng,
					tjr_mobile:this.mobile,
				}).then(res=>{
					if(res){
						if(res.address_id == '0'){
							this.initAddList();
						}else{
							this.storeOne = res;
						}
						// this.leaderInfo = res;
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 列表
			initList(){
				this.tool.getData('/api/mall/getPageSettingNew',{
					side:'c端',
					page:'首页'
				}).then(res=>{
					if(res){
						res.setting.map((item,index)=>{
							if(item.name == '新人购_轮播图'){
								item.content = item.content.split(',');
								item.content.map((item2,index2)=>{
									item2 = 'https://zl-tuangou.oss-cn-qingdao.aliyuncs.com'+item2;
									this.banner.push(item2);
								})
								uni.getImageInfo({
									src:this.banner[0],
									success: (info) => {
										let rate = info.width / info.height;
										this.imgHeight = (uni.getSystemInfoSync().windowWidth / rate) * 2 ;
									},
									fail:(err)=>{
										console.log(err);
									}
								})
							}
						})
						// this.is_newuser = res.newusers_show;
						this.is_newuser = res.is_newuser;
						if(res.is_newuser){
							res = res.newusers;
							let new_user = uni.getStorageSync('new_user')?JSON.parse(uni.getStorageSync('new_user')):{goods_list:[]};
							this.datas = res;
							res.goods_list.map((item,index)=>{
								if(new_user.id == this.id){
									let idx = this.tool.getIdx(new_user.goods_list,'goods_id',item.goods_id);
									if(idx != '-1'){
										item.num = new_user.goods_list[idx].num;
									}else{
										item.num = 0;
									}
								}else{
									item.num = 0;
								}
								let shi = item.nu_set_stock - item.nu_stock;
								item.rate = ((shi + item.nu_sale_num) / (item.nu_set_stock + item.nu_sale_num) * 100).toFixed(2);
								if(item.nu_stock > item.nu_sale_num + shi){
									item.startFlag = true;
								}else{
									item.startFlag = false;
								}
								if(res.is_xg <= 0){
									if(item.is_buyed == 0 || item.user_residue_num <= 0){
										item.hui = true;
									}else{
										item.hui = false;
									}
								}else{
									item.hui = false;
								}
							})
							res.goods_list.sort(this.tool.sortBy('user_residue_num',1));
							res.goods_list.sort(this.tool.sortBy('hui',2));
							this.list = this.page == 1?res.goods_list:this.list.concat(res.goods_list);
							this.load = res.goods_list.length>=10?true:false;
							this.calcPrice();
						}else{
							uni.showToast({
								title:'该账号不能参加新人礼活动',
								icon:"none"
							})
							return;
						}
						
					}
				}).catch(err=>{
					console.log(err);
				})
			}, 
			// 支付
			pay(){
				if(!uni.getStorageSync('uToken')){
					this.loginStatus = false;
					return;
				}
				let goods_list = [];
				this.list.map((item,index)=>{
					if(item.num>0){
						goods_list.push({
							goods_id:item.goods_id,
							num:item.num
						})
					}
				})
				if(!goods_list.length){
					uni.showToast({
						title:'请至少添加一件商品',
						icon:"none"
					})
					return;
				}
				if(!this.leaderInfo.address_id){
					uni.showToast({
						title:'请选择一个自提地址',
						icon:"none"
					})
					return;
				}
				this.tool.getData('/api/mall/createOrderByNewUsers',{
					nu_id:this.id,
					tjr_id:uni.getStorageSync('shareInfo')?uni.getStorageSync('shareInfo').shareId:'',
					address_id:this.leaderInfo.address_id,
					goods_list:JSON.stringify(goods_list),
					service_user_id:this.leaderInfo.id,
				}).then(res=>{
					// console.log(res);
					if(res){
						this.tool.getData('/api/mall/orderPay',{
							oid:res.id
						}).then(payInfo=>{
							uni.requestPayment({
								provider:'wxpay',
								timeStamp:payInfo.info.timeStamp,
								nonceStr:payInfo.info.nonceStr,
								package:payInfo.info.package,
								signType:payInfo.info.signType,
								paySign:payInfo.info.paySign,
								success: (pay) => {
									uni.showToast({
										title:'订单支付成功',
										icon:"success"
									})
									uni.removeStorageSync('new_user');
									setTimeout(()=>{
										uni.switchTab({
											url:"/pages/seller"
										})
									},1650)
								},
								fail:(err)=>{
									console.log(err);
									uni.showToast({
										title:'取消支付',
										icon:"none"
									})
								}
							})
						}).catch(err=>{
							console.log(err);
						})
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 修改数量
			changeCount(status,idx){
				if(!uni.getStorageSync('uToken')){
					this.loginStatus = false;
					return;
				}
				let line = this.list[idx];
				if(status == '1'){
					if(this.datas.is_xg != '0'){
						if(line.num<=0){
							let haveCount = 0;
							this.list.map((item,index)=>{
								if(item.num>0){
									haveCount++;
								}
							})
							if(haveCount>=this.datas.is_xg){
								uni.showToast({
									title:'仅可任选'+this.datas.is_xg+'款商品',
									icon:"none"
								})
								return
							}else{
								line.num++;
								if(line.num>line.user_residue_num){
									uni.showToast({
										title:'该商品限购剩余：'+line.user_residue_num+'份',
										icon:'none'
									})
									line.num = line.user_residue_num;
									return;
								}
							}
						}else{
							line.num++;
							if(line.num>line.user_residue_num){
								uni.showToast({
									title:'该商品限购剩余：'+line.user_residue_num+'份',
									icon:'none'
								})
								line.num = line.user_residue_num;
								return;
							}
						}
					}else{
						line.num++;
						if(line.num>line.user_residue_num){
							uni.showToast({
								title:'该商品限购剩余：'+line.user_residue_num+'份',
								icon:'none'
							})
							line.num = line.user_residue_num;
							return;
						}
					}
				}else{
					line.num--;
					if(line.num<0){
						line.num = 0;
					}
				}
				let new_user = uni.getStorageSync('new_user')?JSON.parse(uni.getStorageSync('new_user')):{};
				if(new_user.id && new_user.id == this.id){
					let index = this.tool.getIdx(new_user.goods_list,'goods_id',this.datas.goods_list[idx].goods_id);
					if(index!='-1'){
						new_user.goods_list[index].num = this.datas.goods_list[idx].num;
						uni.setStorageSync('new_user',JSON.stringify(new_user));
					}
				}
				this.calcPrice();
			},
			// 计算显示价格和数量
			calcPrice(){
				this.carnum = 0;
				this.allPrice = 0;
				this.list.map((item,index)=>{
					this.carnum = this.carnum+item.num;
					let priceOne = item.nu_price * item.num;
					this.allPrice = this.allPrice+priceOne;
				})
			},
			// 查看商品详情
			lookDetail(id){
				uni.navigateTo({
					url:'./shopDetail?actType=4&actId='+this.id+'&id='+id
				})
			},
			// 切换菜单
			/* changeMenu(idx){
				this.status = idx;
				this.page = 1;
				this.initList()
			}, */
			// 选择自提点
			selZiti(){
				this.count = 1;
				uni.navigateTo({
					url:'../my/ziti?id='+this.id+'&leaderInfo='+JSON.stringify(this.leaderInfo),
				})
			},
			// 返回上一页
			back(){
				uni.switchTab({
					url:"/pages/seller"
				})
			},
			// 关闭登录
			closeLogin(data){
				this.getLeaderAdd();
				this.loginStatus = data;
				// this.initConfig();
				this.page = 1;
				this.initList();
			},
			// 保存图片
			saveImg(){
				this.createImg();
			},
			// 分享二维码
			initCode(){
				this.tool.getData('/api/miaosha/getMiaoshaQrcodeNew',{
					ms_id:this.id,
					tjr_mobile:this.mobile,
				}).then(res=>{
					if(res){
						this.postImg = res.qrcode;
						this.shareCode = res.cover_img;
						this.postFlag = true;
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 生成图片
			createImg(){
				uni.showLoading({
					title:'制作中...'
				})
				let thumb = this.datas.share_img;
				let canvasWidth = uni.getSystemInfoSync().windowWidth * 0.8; 
				let ctx = uni.createCanvasContext('myCanvas', this);
				uni.getImageInfo({
					src:this.datas.share_img,
					success: (post) => {
						let rate = post.width / post.height;
						this.canvasHeight = canvasWidth / rate;
						setTimeout(()=>{
							// 填充背景色，白色
							ctx.setFillStyle('#FB5D02'); // 默认白色
							ctx.fillRect(0, 0,canvasWidth,this.canvasHeight); // fillRect(x,y,宽度，高度)
							ctx.drawImage(post.path,0,0,canvasWidth,this.canvasHeight);
							// 头像昵称
							uni.downloadFile({
								url:this.leaderInfo.avatar,
								success: (tx) => {
									let txFile = tx.tempFilePath;
									this.tool.circleImgOne(ctx,txFile,12,8,12);
									// 昵称
									let nickname = this.leaderInfo.nickname;
									ctx.setFontSize(13) // 字号
									ctx.setFillStyle('#ffffff') // 字体颜色
									ctx.fillText(nickname,40,20);//绘制截取部分
									// 提示文字1
									let toast1 = '我觉得这些产品很棒，推荐给你！';
									ctx.setFontSize(12) // 字号
									ctx.setFillStyle('#ffffff') // 字体颜色
									ctx.fillText(toast1,40,35);//绘制截取部分
									uni.hideLoading();
									// 二维码
									uni.showLoading({
										title:'正在为您生成专属分享码...'
									})
									this.tool.base64Save(this.postImg).then(code=>{
										ctx.drawImage(code,50,this.canvasHeight-67,50,50);
										ctx.draw(true,()=>{
											setTimeout(()=>{
												uni.canvasToTempFilePath({ // 保存canvas为图片
													canvasId: 'myCanvas',
													quality: 1,
													width:canvasWidth,
													height:this.canvasHeight,
													destWidth:canvasWidth * 3,
													destHeight:this.canvasHeight * 3,
													complete: (res)=> {
														uni.hideLoading();
														if(res.tempFilePath){
															uni.saveImageToPhotosAlbum({
																filePath:res.tempFilePath,
																success: () => {
																	uni.showToast({
																		title:"图片已保存",
																		icon:'success'
																	})
																	this.tool.monitor(this.link);
																},
																fail:(err)=>{
																	console.log(err);
																	uni.showToast({
																		title:'图片保存失败',
																		icon:'none'
																	})
																}
															})
														}
													},
												},this) // 这里是新增的this，只有在微信小程序中需要加入，不然会报错
											},500)
										})
									}).catch(err=>{
										console.log(err);
									})
								},
								fail:(err)=>{
									console.log(err);
								},
								complete: () => {}
							})
						},500)
					},
					fail:(err)=>{
						uni.showToast({
							title:'图片信息获取失败',
							icon:"none"
						})
					},
					complete: () => {
						
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	page{
		background: white;
	}
	.seckill{
		width: 100%;
		.bottomBtn{
			width: 100%;
			background: white;
			position: fixed;
			bottom: 0;
			left:0;
			padding: 20rpx 24rpx;
			box-sizing: border-box;
			.opBtns{
				width:27.5%;
				.smallMenu{
					width:42.5%;
					text-align: center;
					font-size:12px;
					position: relative;
					.count{
						width: 34rpx;
						height: 34rpx;
						border-radius: 50%;
						text-align: center;
						line-height: 34rpx;
						background: #FF5000;
						position: absolute;
						top: -17rpx;
						right: -17rpx;
						color: #FDD100;
						font-size: 12px;
					}
					.menuIcon{
						width: 40rpx;
						height: 40rpx;
						margin:0 auto 4rpx;
					}
				}
			}
			.tj{
				width: auto;
				.resultPrice{
					text{
						color: #FF6200;
						font-size: 20px;
						font-weight: bold;
					}
				}
				.payBtn{
					width: max-content;
					padding: 22rpx 42rpx;
					color: white;
					border-radius: 50px;
					background: linear-gradient(180deg, #FC9700 0%, #FF5000 100%);
					margin-left: 20rpx;
				}
			}
		}
		.ios_padding{
			padding-bottom:env(safe-area-inset-bottom);
		}
		.list{
			width: 100%;
			padding: 24rpx;
			box-sizing: border-box;
			.shopOne{
				width: 100%;
				margin-bottom: 20rpx;
				.shopInfo{
					flex: 1;
					.config{
						width: 100%;
						.priceTag{
							width: 100%;
							font-size: 12px;
							margin-bottom: 6rpx;
							.miaosha{
								width: max-content;
								background: linear-gradient(180deg, #FF6200 0%, #FE3140 100%);
								color: white;
								border: 1px solid #FF6200;
							}
							.jiang{
								color: #FF6200;
								border: 1px solid #FF6200;
							}
							view{
								padding: 0 8px;
								line-height: 36rpx;
								border-radius: 8rpx;
								margin-right:4rpx;
							}
							.xgNum{
								flex: 1;
								text-align: right;
								font-size: 12px;
								color: #999999;
							}
						}
						.tools{
							width: 100%;
							.count{
								width:auto;
								.smallIpt{
									width:54rpx;
									height:54rpx;
									margin:0 12rpx;
									input{
										width:54rpx;
										height:54rpx;
										text-align:center;
										line-height:54rpx;
									}
								}
								.smallBtn{
									width:54rpx;
									height:54rpx;
									image{
										width:54rpx;
										height:54rpx;
									}
								}
							}
							.showPrice{
								color: #FF6200;
								font-size: 12px;
								text{
									font-size: 20px;
									font-weight: bold;
								}
							}
						}
					}
					.bar{
						width: 100%;
						font-size: 12px;
						color: #999999;
						margin-bottom:50rpx;
						.barContent{
							flex: 1;
						}
						.progress{
							width: 39%;
							margin-right: 12rpx;
							height: 20rpx;
							background: #F6F6F6;
							border-radius: 10rpx;
							overflow: hidden;
							.current{
								width: 0;
								height: 100%;
								border-radius: 10rpx;
								background: #FF6200;
							}
						}
					}
					.shopName{
						width: 100%;
						font-size: 15px;
						font-weight: bold;
						line-height: 20px;
						margin-bottom: 18rpx;
					}
				}
				.shopImg{
					width: 264rpx;
					height: 264rpx;
					border-radius: 4px;
					margin-right: 16rpx;
					overflow: hidden;
					image{
						width: 264rpx;
						height: 264rpx;
					}
				}
			}
			.shopOne:last-child{
				margin-bottom: 0;
			}
			.hui{
				.shopInfo{
					.config{
						width: 100%;
						.priceTag{
							width: 100%;
							font-size: 12px;
							margin-bottom: 6rpx;
							.miaosha{
								width: max-content;
								background: #999999;
								color: white;
								border: none
							}
							.jiang{
								color: #999999;
								border: 1px solid #999999;
							}
						}
						.tools{
							width: 100%;
							.showPrice{
								color: #999999;
							}
						}
					}
					.bar{
						.progress{
							background: #F6F6F6;
							.current{
								background: #DFDFDF;
							}
						}
					}
				}
			}
		}
		/* .menus{
			width: 100%;
			padding: 24rpx 0 14rpx;
			background: white;
			.menuOne{
				flex: 1;
				text-align: center;
				.tit{
					font-size: 16px;
					font-weight: bold;
					margin-bottom: 6rpx;
				}
				.desc{
					font-size: 12px;
					color: #999999;
				}
			}
			.active{
				.desc{
					color: #FF8C0F;
				}
				color: #FF5000;
			}
		} */
		.teamInfo{
			width: 100%;
			padding: 26rpx;
			box-sizing: border-box;
			background: linear-gradient(180deg, #FFB446 0%, #FF5000 100%);
			color: white;
			.info{
				width: calc(100% - 45px);
				.zt{
					width: 100%;
					margin: 8rpx 0;
					.shop{
						width: auto;
						margin-right: 8rpx;
					}
					.time{
						width: auto;
						padding: 4rpx 10rpx;
						background: white;
						border-radius: 4px;
						color:#FF5000;
					}
				}
				.ztAdd{
					width: 100%;
					font-size: 12px;
					.exchange{
						width:auto;
						margin-left: 8px;
					}
					.add{
						width: 90%;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}
				}
			}
			.teamImg{
				width: 105rpx;
				height: 105rpx;
				margin-right: 16rpx;
				border-radius: 4px;
				overflow: hidden;
				image{
					width: 100%;
					max-height: 100%;
					border-radius: 4px;
				}
			}
		}
		.advImg{
			width: 100%;
		}
	}
	.zz{
		color: white;
		font-size:16px;
		.closeBtn{
			width: max-content;
			padding: 8px 50px;
			margin: 10px auto;
			font-size: 12px;
			border-radius: 30px;
			color: white;
			border: 1px solid white;
		}
		.advImg{
			margin-bottom: 10px!important;
		}
		.opBtns{
			width: 100%;
			position: absolute;
			bottom: 0;
			left: 0;
			background: white;
			padding:0 0 25px;
			box-sizing: border-box;
			.toast{
				width: 100%;
				text-align:center;
				padding:12px 0;
				color:#666666;
			}
			.close{
				width: 94%;
				margin:6px auto 0;
				text-align:center;
				color:#666666;
				font-size:12px;
			}
			.btns{
				width: 100%;
				.opBtnOne{
					width: max-content;
					text-align: center;
					font-size: 12px;
					color: #333333;
					.btnImg{
						width: 45px;
						height: 45px;
						margin-bottom: 8px;
					}
				}
			}
		}
	}
	.zz2{
		top: 0;
		// left:-100%;
		left:0;
		position: fixed;
	}
	.ios_pageTitle,.and_pageTitle{
		background: #FFB43C;
		.pageTitle{
			.backIcon{
				width: 62rpx;
			}
		}
	}
</style>
